<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<link rel="stylesheet" href="./framework/font-awesome-4.7.0/css/font-awesome.min.css">
		<link rel="stylesheet" href="./framework/reset.css">
		<link rel="stylesheet" href="./css/login.css">
		<title>东软环保公众监督系统-公众监督员端-登录</title>
		<script src="../js/axios.js"></script>
	</head>
	<body>
		<!-- 总容器 -->
		<div class="wrapper">
			<!-- 头部 -->
			<header>
				<img src="./img/bgtop.png">
			</header>

			<!-- 标题 -->
			<h1>东软环保公众监督系统</h1>
			<div class="title">
				<p></p>
				<p>公众监督员端</p>
				<p></p>
			</div>

			<!-- 登录表单 -->
			<section>
				<div class="input-box">
					<i class="fa fa-user-o"></i>
					<input id="telId" type="text" placeholder="输入手机号">
				</div>
				<div class="input-box">
					<i class="fa fa-lock"></i>
					<input id="password" type="password" placeholder="输入登录密码">
				</div>
				<div class="reg-box">
					<p onclick="location.href='register.html'">注册</p>
					<p>忘记密码?</p>
				</div>
				<div class="button-box" onclick="login();">登录</div>
			</section>
		</div>
	</body>
	<script>
		function login() {
			let telId = document.getElementById("telId").value;
			let password = document.getElementById("password").value;
			let url = "http://localhost:8080/supervisor/login?telId=" + telId + "&password=" + password;
			axios.get(url).then((r) => {
				if (r.data.code == 200) {
					alert("登录成功")
					let supervisor = r.data.data.user;
					let token = r.data.data.token;
					localStorage.setItem("token", token);
					localStorage.setItem("telId", supervisor.telId);
					location.href = "selectGrid.html";
				} else {
					alert("登录失败")
				}
			})
		}
	</script>
</html>